import Api from "../../utils/request";
// 初始化页面动画需要变量
let startY = 0; // 手指触摸初始位置
let moveY = 0;  // 手指移动位置
let moveDistance = 0; // 手指移动距离
// pages/personal/personal.js
Page({

  /**
   * 页面的初始数据
   */
  data: {
    // 页面动画区域初始移动距离
    coverTransform: 'translateY(0)',
    coverTransition: '',
    userInfo: [], // 用户信息
    recentPlayList: [] // 用户播放记录
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    // 获取用户基本信息
    let userInfo = wx.getStorageSync('userInfo')
    // console.log(userInfo);
    if (userInfo) {
      this.setData({
        userInfo: JSON.parse(userInfo)
      })
      // 获取用户播放列表
      this.getUserRecentPlayList(this.data.userInfo.userId)
    }

  },
  // 获取播放记录的功能函数封装
  async getUserRecentPlayList(userId) {
    let recentPlayData = await Api.request('/user/record', {uid: userId, type: 0})
    // console.log(recentPlayData);
    // 由于后台返回的数据没有唯一的值作为 wx:key 所以我们自己改造
    let index = 0;
    let recentPlayList = recentPlayData.allData.slice(0, 10).map(item => {
      item.id = index++;
      return item;
    })
    this.setData({
      recentPlayList
    })
  },

  /**
   * 事件机制处理方法
   */
  handleTouchStart(event) {
    this.setData({
      coverTransition: ''
    })
    // 获取手指初始位置
    startY = event.touches[0].clientY;
  },
  handleTouchMove(event) {
    moveY = event.touches[0].clientY
    moveDistance = moveY - startY
    if (moveDistance <= 0) {
      return
    }
    if (moveDistance >= 80) {
      moveDistance = 80;
    }
    this.setData({
      coverTransform: `translateY(${moveDistance}rpx)`
    })
  },
  handleTouchEnd() {
    this.setData({
      coverTransform: `translateY(0rpx)`,
      coverTransition: 'transform 1s linear'
    })
  },
  // 跳转至登录页面
  goLogin() {
    wx.navigateTo({
      url: '/pages/login/login',
    })
  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady: function () {

  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow: function () {

  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide: function () {

  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload: function () {

  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh: function () {

  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function () {

  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage: function () {

  }
})